.main-box3 {
  height: 340px;
  // background-color: purple;
  margin: 20px 0;
  box-sizing: border-box;
  > .wrapper {
    box-sizing: border-box;
    background-color: #fff;
    padding: 10px;
    display: flex;
    justify-content: space-between;
    > .skinlady {
      box-sizing: border-box;
      width: 49%;
      background-color: #fff;
      > div:nth-of-type(1) {
        display: flex;
        line-height: 60px;
        height: 60px;
        justify-content: space-between;
        > ul {
          display: flex;
          > li {
            padding: 0 10px;
            > a {
              color: red;
            }
          }
        }
        > div {
          display: flex;
          align-items: center;
          > h3 {
            font-weight: 700;
            font-size: 24px;
          }
          > p {
            font-size: 12px;
            color: red;
            margin-left: 10px;
            width: 15px;
            height: 15px;
            text-align: center;
            line-height: 15px;
            border-radius: 50%;
            border: 1px solid red;
            cursor: pointer;
            transition: 0.5s;

          }
          > p:hover {
            background-color: red;
            color: #fff;
          }
        }
      }
      > div:nth-last-of-type(1) {
        height: 270px;
        // background-color: turquoise;
      }
    }
    > .brand {
      width: 49%;
      background-color: #fff;
      > div:nth-of-type(1) {
        display: flex;
        line-height: 60px;
        height: 60px;
        justify-content: space-between;
        > div {
          display: flex;
          align-items: center;
          > h3 {
            font-weight: 700;
            font-size: 24px;
          }
          > p {
            font-size: 12px;
            color: red;
            margin-left: 10px;
            width: 15px;
            height: 15px;
            text-align: center;
            line-height: 15px;
            border-radius: 50%;
            border: 1px solid red;
            cursor: pointer;
            transition: 0.5s;
          }
          > p:hover {
            background-color: red;
            color: #fff;
          }
        }
      }
      > div:nth-last-of-type(1) {
        height: 270px;
        position: relative;
        box-sizing: border-box;
        display: flex;
        cursor: pointer;
        > div {
          cursor: pointer;
          text-align: center;
          padding: 20px;
          width: 45%;
          background-color: rgb(245, 243, 243);
          // background-color: red;
          > p {
            padding-bottom: 5px;
          }
          > p:nth-of-type(2) {
            font-weight: 700;
            font-size: 18px;
          }
          > img {
            width: 130px;
            height: 130px;
          }
        }
        > ul {
          box-sizing: border-box;
          top: -35px;
          right: 0;
          width: 50%;
          height: 270px;
          position: absolute;
          
         
          // background-color: aqua;
          > li {
            height: 90px;
            display: flex;
            padding-bottom: 10px;
            > div {
              text-align: center;
              width: 50%;
              height: 100%;
              // background-color: slateblue;
              > p {
                font-size: 12px;
                cursor: pointer;
                > img {
                  width: 120px;
                  height: 70px;
                }
              }              
            }
          }
        }
      }
    }
  }
}
